<div class="business-detail-top">
	<div class="btn-group dropdown-select pull-left">
		<button style="width:110px;" class="btn dropdown-toggle" {{action "dropdown" bubbles=false}}>
			<span class="dropdown-selected" {{bind-attr title=model.name}}>{{model.name}}</span>
			<span class="caret"></span>
		</button>
		<ul class="dropdown-menu">
		{{#each otherApps as |app|}}
			<li><a href="#" {{action "gotoOtherApp" app}}>{{app.name}}</a></li>
		{{else}}
			<li><a href="javascript:;">无其他业务系统</a></li>
		{{/each}}
		</ul>
	</div>
	<div class="date-info">
		{{#if isRealtimeMode}}
			<div class="today">{{today}}</div>
			<div class="subtitle">最近60分钟</div>
		{{else}}
			<div {{bind-attr class=":btn-group isMonthSelectorShow:open"}}>
				<button style="width:110px;" class="btn dropdown-toggle" {{action "toggleMonthSelector"}}>
					<span class="" {{action "backToOverview"}}>{{historyDate.name}}</span>
					<span class="caret"></span>
				</button>
				<div class="dropdown-menu pull-right" style="width:auto; ">
					{{view view.MonthSelector date=selctedDate}}
				</div>
			</div>
			<div class="subtitle">{{selectedFormatedDate}}</div>
		{{/if}}
	</div>
	<div class="sequence-chart">
		{{view view.Sequence
			id="businessSequenceView"
			class="sequence-view"
			displayMode=sequenceChartDisplayMode
			data=sequenceData
			itemClick="sequenceItemClick"
			overviewMousemove="sequencehoverItemChanged"
			mouseoutChart="mouseoutSequenceChart"}}

		{{#if isSequenceChartDisplayDetail}}
			{{view view.GraduationView
				startTime=model.startXAxisTime
				length=axisLength
				timePoint=pinTimePoint
				class="business-list-item-graduation"
				endTime=model.endXAxisTime}}
		{{else}}
			{{view view.GraduationView
				startTime=historyDate.start
				length=axisLength
				class="business-list-item-graduation"
				mode="month"
				endTime=historyDate.end}}
		{{/if}}

	</div>
</div>
<ul class="nav nav-tabs apm-nav-tabs business-detail-tabs">
	<li>{{#link-to "business.detail.gauge"}}业务仪表板{{/link-to}}</li>
	<li>{{#link-to "business.detail.experience"}}最终用户体验{{/link-to}}</li>
	{{#unless auth.isNormal}}
	<li>{{#link-to "business.detail.config"}}管理配置{{/link-to}}</li>
	{{/unless}}
	<li>{{#link-to "business.detail.nodedetail" class="hide"}}节点详情{{/link-to}}</li>
	<li>{{#link-to "business.detail.trade" class="hide"}}关键交易详情{{/link-to}}</li>
	<li>{{#link-to "business.detail.nodetype" class="hide"}}关键交易详情{{/link-to}}</li>

	<div class="btn-group dropdown3-select pull-right">
		<button style="width:90px; height:24px; top:6px" class="btn dropdown-toggle" {{action "dropdown3" bubbles=false}}>
			<span class="dropdown3-selected">
				{{#if isRealtimeMode}}
					实时模式
				{{else}}
					回溯模式
				{{/if}}
			</span>
			<span class="caret" style="top:2px;"></span>
		</button>
		<ul class="dropdown-menu">
			<li><a href="#" {{action "toggleRealtimeMode" 1}}>实时模式</a></li>
			<li><a href="#" {{action "toggleRealtimeMode" 0}}>回溯模式</a></li>
		</ul>
	</div>

	<div class="btn-group dropdown2-select pull-right">
		<button style="width:90px; height:24px; top:6px; margin-right:4px;" class="btn dropdown-toggle" {{action "dropdown2" bubbles=false}}>
			<span class="dropdown2-selected">{{businessSwitchName}}</span>
			<span class="caret" style="top:2px;"></span>
		</button>
		<ul class="dropdown-menu">
			<li><a href="#" {{action "thresholdOrTrading" 1}}>交易模式</a></li>
			<li><a href="#" {{action "thresholdOrTrading" 0}}>应用模式</a></li>
		</ul>
	</div>

</ul>
<div>
	{{outlet}}
</div>